<!doctype html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>个人简历</title>
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/style.css">
</head>

<body>
    <nav class="nav">
        <div class="container">
            <div class="row  align-content-center">
                <div class="col-md-2">
                    <a href=""><img src="img/2.jpg" alt=""></a>
                </div>
                <div class="col-md-10">
                    <ul class="d-flex justify-content-end">
                        <li><a href="" class="active">主页</a></li>
                        <li><a href="">关于</a></li>
                        <li><a href="">简历</a></li>
                        <li><a href="">服务</a></li>
                        <li><a href="">工作</a></li>
                        <li><a href="">证明</a></li>
                        <li><a href="">博客</a></li>
                    </ul>
                </div>
            </div>
        </div>
    </nav>

    <header class="header-bg">
        <div class="container text-center header-inner">
            <span>Welcome</span>
            <h1>I Im Mark Heng</h1>
            <div class="scroll-down">
                <span></span>
            </div>
        </div>

    </header>

    <section class="about-area">
        <div class="container">
            <div class="row">
                <div class="col-md-6">
                    <img src="img/profile-pic.jpg" alt="">
                </div>
                <div class="col-md-6">
                    <div class="section-title">
                        <h2>关于我</h2>
                        <p>本人有良好的职业道德和素养，能承受较强的工作压力，性格开朗大方、为人正直、心地善良，与人相处融洽，
                            有一定的社交能力。易与人相处，诚实可信，能吃苦耐劳，有耐心，乐于助人。</p>
                    </div>
                    <ul>
                        <li>
                            <strong>姓名：</strong>
                         王恒
                        </li>
                        <li>
                            <strong>年龄：</strong>
                            19
                        </li>
                        <li>
                            <strong>来自：</strong>
                      邯郸
                        </li>
                        <li>
                            <strong>电子邮箱：</strong>
                            1437748842@qq.com
                        </li>
                        <li>
                            <strong>电话 ：</strong>
                         13231122197
                        </li>
                        <li>
                            <strong>求职工作 </strong>
                            网络前端工程师
                        </li>

                    </ul>
                    <a href="" class="boxed-btn">Hire</a>
                    <a href="" class="boxed-btn">My work</a>
                </div>
            </div>
        </div>
    </section>
    <section class="skill-section">
        <div class="container">
            <div class="row">
                <div class="col-md-12 text-center">
                    <div class="section-title main">
                        <h2>我的技能</h2>
                        <p>
                            Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptatem quas error modi quaerat
                            sequi, debitis!
                        </p>
                    </div>
                </div>
            </div>
            <div class="row text-center">
                <div class="col-md-3 col-sm-6">
                    <div id="circle-1">
                        <i></i>
                        <span>95 %</span>
                    </div>
                    <h4>HTML</h4>
                </div>
                <div class="col-md-3 col-sm-6">
                    <div id="circle-2">
                        <i></i>
                        <span>95 %</span>
                    </div>
                    <h4>CSS</h4>
                </div>
                <div class="col-md-3 col-sm-6">
                    <div id="circle-3">
                        <i></i>
                        <span>90 %</span>
                    </div>
                    <h4>JavaScript</h4>
                </div>
                <div class="col-md-3 col-sm-6">
                    <div id="circle-4">
                        <i></i>
                        <span>85 %</span>
                    </div>
                    <h4>Ajax</h4>
                </div>
            </div>
        </div>
    </section>

    <section class="resome-area skill-section">
        <div class="container">
            <div class="row">
                <div class="col-md-12 text-center">
                    <div class="section-title main">
                        <h2>工作经历</h2>
                        <p>
                            Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptatem quas
                            <br>
                            error modi quaerat sequi, debitis!
                        </p>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-4 col-sm-6">
                    <div class="single-blog-post">
                        <div class="post-thumb">
                            <img src="img/5.jpg" alt="">
                        </div>
                        <h4>2015年-2016年</h4>
                       <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Labore, excepturi modi eius a vel accusamus!</p>
                        <a href="#" class="boxed-btn">Read More</a>
                    </div>
                </div>
                <div class="col-md-4 col-sm-6">
                    <div class="single-blog-post">
                        <div class="post-thumb">
                            <img src="img/6.jpg" alt="">
                        </div>
                        <h4>STANdard POST WITH IMAGE</h4>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Labore, excepturi modi eius a vel accusamus!</p>
                        <a href="#" class="boxed-btn">Read More</a>
                    </div>
                </div>
                <div class="col-md-4 col-sm-6">
                    <div class="single-blog-post">
                        <div class="post-thumb">
                            <img src="img/7.jpg" alt="">
                        </div>
                        <h4>STANdard POST WITH IMAGE</h4>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Labore, excepturi modi eius a vel accusamus!</p>
                        <a href="#" class="boxed-btn">Read More</a>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <section class="resome-area skill-section">
        <div class="container">
            <div class="row">
                <div class="col-md-12 text-center">
                    <div class="section-title main">
                        <h2>联系我</h2>
                        <p>
                            Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptatem quas
                            <br>
                            error modi quaerat sequi, debitis!
                        </p>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-4 col-sm-12">
                    <div class="single-contact-box">
                        <div class="icon">
                            <img src="img/w.png" alt="">
                        </div>
                        <h4>电子邮件</h4>
                        <p>1437748842@qq.com</p>
                    </div>
                    <div class="single-contact-box">
                        <div class="icon">
                            <img src="img/e.png" alt="">
                        </div>
                        <h4>来自</h4>
                        <p>河北 邯郸</p>
                    </div>
                    <div class="single-contact-box">
                        <div class="icon">
                            <img src="img/r.png" alt="">
                        </div>
                        <h4>电话</h4>
                        <p>13231122197</p>
                    </div>
                </div>
                <div class="col-md-8 col-sm-12">
                    <div class="contact-form-wrapper">
                        <form action="index.html">
                            <div class="row">
                                <div class="col-md-6 col-sm-12">
                                    <input type="text" placeholder="Enter Name">
                                </div>
                                <div class="col-md-6 col-sm-12">
                                    <input type="text" placeholder="Enter Email">
                                </div>
                                <div class="col-md-12">
                                    <input type="text" placeholder="Enter Sujbect">
                                    <textarea name="message" id="message" cols="30" rows="10" placeholder="Meassage"></textarea>
                                    <input type="submit" value="发送消息" class="boxed-btn">
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </section>

<footer>
    Copyright © 2017 Company Name - Design: 版权归作者所有无权下载
</footer>
    
    <script src="js/script.js"></script>


</body>

</html>